import { FC, useState } from 'react';
import { Button, Drawer, DrawerProps } from 'antd';

import { CheckOutlined, RollbackOutlined } from '@ant-design/icons';
import { getValidateMessage } from '@/utils/validate-rules/message';
import CheckboxTableForm from '@/biz-components/hoc-form/checkbox-table-form';
import { DynamicObjectAny } from '@/typings';
import { uuidv4 } from '@ey-utils/utils/utils';
import { onFieldValueChange } from '@formily/core';

interface CheckboxTableDrawerProps extends DrawerProps {
    cancel: () => void;
    confirm: (values: any[]) => void;
    defaultValue?: any[];
    extraPrams?: DynamicObjectAny;
    pageCode: string;
    pageApi: string;
    drawerRowSelection: any; // 外部传入的rowSelection
    noPagination?: boolean;
    noQueryKeys?: boolean;
    rowKey?: string;
}

const CheckboxTableDrawer: FC<CheckboxTableDrawerProps> = (props) => {
    const {
        cancel,
        confirm,
        defaultValue,
        extraPrams,
        pageCode,
        pageApi,
        drawerRowSelection,
        noPagination,
        noQueryKeys,
        rowKey
    } = props;
    const [values, setValues] = useState<any[]>([]);
    const [reloadFlag, setreloadFlag] = useState<any>(0);

    const handleCheckClick = () => {
        confirm(values);
    };

    const handleRollbackClick = () => {
        cancel();
    };

    const changeSelect = (vals: any[]) => {
        setValues(vals);
    };

    const { getCheckboxProps, ...propsRowSelection } = drawerRowSelection || {};
    let rowSelection: any = {
        onChange: (selectedRowKeys: string[], selectedRows: any[]) => {

            changeSelect(selectedRows);
        },
        ...propsRowSelection,
        getCheckboxProps: (record: any) => {
            if (getCheckboxProps) {
                return getCheckboxProps(record, values);
            }
        },
    };
    const changeItem = (v) => {
        if (v?.length < 14) {
            return;
        }
        setreloadFlag(uuidv4());
    };
    const handleMeta = (res: T): T => {
        console.log(res);
        res?.pageDatas?.forEach?.(it => {
            if (it?.type === "search_column" && it?.key === "arcvBizCode") {
                it.props.onChange = changeItem;
            }
        });
        return res;
    }
    return (
        <>
            <Drawer
                title="请选择"
                placement="right"
                closable={false}
                onClose={handleRollbackClick}
                visible
                width="90%"
                maskClosable={false}
                footer={
                    <div className="page__foot">
                        <div className="content__slot__left">
                            <Button
                                onClick={handleRollbackClick}
                                icon={<RollbackOutlined />}
                                className="reset-btn"
                            >
                                {getValidateMessage('common.cancel', true)}
                            </Button>
                        </div>
                        <div className="page__foot_right_btns">
                            <Button onClick={handleCheckClick} type="primary" icon={<CheckOutlined />}>
                                {getValidateMessage('common.confirm', true)}
                            </Button>
                        </div>
                    </div>
                }
                bodyStyle={{
                    overflowX: 'hidden',
                }}
            >
                <CheckboxTableForm
                    noTableOpCol
                    pageCode={pageCode}
                    pageApi={pageApi}
                    noModal
                    rowKey={rowKey}
                    needGroup
                    rowSelection={rowSelection}
                    noQueryKeys={noQueryKeys}
                    oldValue={values}
                    extraPrams={extraPrams}
                    dealMetaBeforeRender={handleMeta}
                    reloadFlag={reloadFlag}
                    noPagination={noPagination}
                    noInit
                    allSelect
                    formConfigs={{
                        effects: () => {
                            onFieldValueChange('arcvBizCode', st => {
                                changeItem(st.value);
                            });
                        }
                    }}
                />
            </Drawer>
        </>
    );
};



export default CheckboxTableDrawer;
